<template>
  <div id="common-import-export">
    <div v-for="item in configs" :key="item.requestPath">
      <CommonImport v-if="item.type === 'import'" v-bind="item" v-on="$listeners"></CommonImport>
      <CommonExport v-if="item.type === 'export'" v-bind="item" v-on="$listeners"></CommonExport>
    </div>
  </div>
</template>

<script>
import CommonImport from './import.vue'
import CommonExport from './export.vue'

export default {
  name: 'CommonImportExport',
  props: {
    configs: {
      type: Array,
      default: () => [],
      required: true
    }
  },
  data() {
    return {

    }
  },
  components: {
    CommonImport,
    CommonExport
  }
}
</script>

<style lang="less">
#common-import-export {
  display: inline-flex;
  align-items: center;
}
</style>
